import type { PropType } from 'vue'
import type { ExtractProps } from '@/utils/type'
import styleVar from '@/styles/variable.module.scss'
import { toStrFirstCase } from '@/utils'
import { Input } from '@/components'

namespace Numberbox {
  export const name = toStrFirstCase(`${styleVar.namespace}Numberbox`)
  export const props = {
    modelValue: Number,
    min: Number,
    max: Number,
    /**
     * 点击加或减每次操作 step
     * @默认 1
     */
    step: {
      type: Number,
      default: 1
    },
    /**
     * 是否只能输入 step 的倍数
     */
    stepStrictly: Boolean,
    disabled: Boolean,
    /**
     * 是否显示加或减
     * @默认 true
     */
    controls: {
      type: Boolean,
      default: true
    },
    /**
     * 小数精度
     * @默认 不限制
     */
    precision: Number,
    /**
     * input 的参数列表
     */
    inputProps: Object as PropType<Input.Props>
  }
  type BaseProps = ExtractProps.Types<typeof props>
  export const emits = {
    add: (_val: BaseProps['modelValue']) => true,
    reduce: (_val: BaseProps['modelValue']) => true,
    'update:modelValue': (_val: BaseProps['modelValue']) => true,
    change: (_val: BaseProps['modelValue']) => true
  }
  export type Props = BaseProps & PartialEmits<typeof emits>
  export type Slots = Input.Slots
  export const Component = <{
    new(): {
      $props: Props
      $slots: Slots
    }
  }>{}
}
export default Numberbox